<template>
  <!-- 问卷修改 -->
  <div>
    <div class="vehicle-details-wrap">
      <div class="box">
        <FormPanel ref="editQuestionFormPanel" :list="editQuestionList" :cols="3" :labelWidth="100" :isSubmitBtn="false" />
      </div>
    </div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'center'
      }"
    >
      <el-button type="primary" icon="el-icon-tickets" @click="confirmDialog">确 定</el-button>
      <el-button icon="el-icon-refresh-left" @click="closeDialog">取 消</el-button>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  props: ['chooseQuestion'],
  data() {
    return {
      editQuestionList: this.createEditQuestionList()
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    createEditQuestionList() {
      return [
        {
          type: 'INPUT',
          label: '问题内容',
          fieldName: 'QUESTION_CONTENT'
        },
        {
          type: 'INPUT',
          label: '答案',
          fieldName: 'answer'
        },
        {
          type: 'INPUT',
          label: '备注',
          fieldName: 'REMARK'
        }
      ];
    },
    confirmDialog() {
      this.$confirm('是否确认确定?', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          // TODO 确认的逻辑
        })
        .catch(() => {});
    },
    closeDialog() {
      this.$emit('closeEdit', false);
    }
  }
};
</script>
<style lang="less" scoped>
.vehicle-details-wrap {
  position: relative;
  margin-top: 20px;
  padding-bottom: @modulePadding;
  .box {
    border: 1px solid #ccc;
    padding-top: 15px;
    padding-right: 15px;
    border-radius: @borderRadius;
    margin-bottom: 20px;
    box-shadow: @boxShadow;
  }
}
</style>
